/*
  需求
    定义一个插件
      添加两个 全局方法
        $showLoading 显示loading
        $hideLoading  关闭loading
  需要外部 得到 一个组件实例
  组件.$mount() 渲染组件 template
    .$el获取 渲染好的dom
  组件.$mount().$el 获取组件渲染的dom结构
  注册组件的第4中方式
  const ComponentClass = Vue.extend(LoadingOptions);
  返回值 是 组件 构造函数 new这个构造函数 返回组件实例
  const loadingComponent = new ComponentClass()
  loadingComponent.$mount().$el
*/

import LoadingOptions from '../Loading/index.vue' //
const Loading = {
  install (Vue) {
    // 返回了 组件的构造函数  new构造函数 得到组件实例
    const LoadingClass = Vue.extend(LoadingOptions)
    const loadingComponent = new LoadingClass()
    // console.log(loadingComponent.$mount().$el)
    // 将组件 渲染的dom 挂载到body上
    document.body.appendChild(loadingComponent.$mount().$el)
    Vue.prototype.$showLoading = () => {
      // 将组件实例  isShow变成变成true
      loadingComponent.isShow = true
    }
    Vue.prototype.$hideLoading = () => {
      // 将组件实例  isShow变成变成false
      loadingComponent.isShow = false
    }
  }
}
export default Loading 